<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="redis" uri="http://www.shopjsp.com/redisTag/functions" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="basePath" value="${redis:getSysConfig('base_path_back')}"/>
<c:set var="uploadPath" value="${redis:getSysConfig('uploadFileVisitRoot')}"/>
<script type="text/javascript">
    /**
     * 自定义验证规则
     */
    function validateForm() {
        form.bootstrapValidator({
            message: "无效的值",
            feedbackIcons: {
                valid: "glyphicon glyphicon-ok",
                invalid: "glyphicon glyphicon-remove",
                validating: "glyphicon glyphicon-refresh"
            },
            fields: {
                imageInfo_1: {
                    validators: {
                        notEmpty: {message: "请上传图片"},
                        file: {maxSize: 1024 * 1024, message: '请上传一张最大不超过1M的jpg/png/gif图片文件'}
                    }
                },
                imageInfo_2: {
                    validators: {
                        notEmpty: {message: "请上传图片"},
                        file: {maxSize: 1024 * 1024, message: '请上传一张最大不超过1M的jpg/png/gif图片文件'}
                    }
                },
                brandName: {
                    validators: {
                        notEmpty: {message: "品牌名称不可为空"},
                        stringLength: {max: 50, message: "品牌名称最大长度为50"}
                    }
                },
                title: {
                    validators: {
                        notEmpty: {message: "标题不可为空"},
                        stringLength: {max: 100, message: "标题最大长度为100"}
                    }
                },
                synopsis: {
                    validators: {
                        notEmpty: {message: "简介不可为空"},
                        stringLength: {max: 150, message: "简介最大长度为150"}
                    }
                },
                sortCode: {
                    validators: {
                        notEmpty: {message: "排序号不可为空"},
                        stringLength: {max: 4, message: "排序号最大长度为4"},
                        numeric: {
                            message: '只能输入数字'
                        }
                    }
                }
            }
        });
    }

    /**
     * 添加品牌
     */
    <shiro:hasPermission name="back_gotoBrandPage_add">
    function addInfo() {
        $("#myModalLabel").empty().text("添加品牌信息");
        /**清空隐藏域的值**/
        $("#brandId").val("");
        $("#imageUrl_1").val("");
        $("#imageUrl_2").val("");
        /**如果有上传图片功能添加此代码，否则可以去掉**/
        initImageForAdd(1,"sys_shop","image_brand", 1,191,77);
        initImageForAdd(2,"sys_shop", "image_brand", 1,200,100);
        resetAddForm();
    }
    </shiro:hasPermission>

    /**
     * 编辑品牌
     */
    <shiro:hasPermission name="back_gotoBrandPage_update">
    function editInfo() {
        $("#myModalLabel").empty().text("修改品牌信息");
        /**获取选中行的id**/
        var selectedRow = $("#tt").bootstrapTable('getSelections');
        if (selectedRow.length == 1) {
            var id = selectedRow[0].brandId;
            $("#btn_edit").attr("data-target", "#addOrEditModal");/**选中了记录后才可打开对应的模态框**/
            $.ajax({
                type: "POST",
                dataType: "JSON",
                url: "${basePath}/back/brand/getBrandInfo.sjson",
                data: {brandId: id},
                success: function (result) {
                    var data = JSON.parse(result.data);
                    /**隐藏域**/
                    $("#brandId").val(data.brandId);
                    $("#imageUrl_1").val(data.brandBigImageUrl);
                    $("#imageUrl_2").val(data.brandImageUrl);
                    /**可见表单控件**/
                    $("#brandName").val(data.brandName);
                    $("#sortCode").val(data.sortCode);
                    $("#title").val(data.title);
                    $("#synopsis").val(data.synopsis);
                    $("#firstWord").val(data.firstWord);
                    $("#isShow_" + data.isShow).attr("checked", "checked");
                    $("#isRecommend_" + data.isRecommend).attr("checked", "checked");
                    $("#isHomePage_" + data.isHomePage).attr("checked", "checked");
                   /**回写预览上传文件所需的信息，如果有上传图片功能添加此代码，否则可以去掉**/
                    initImageForUpdate(1,"sys_shop","image_brand", 1,191,77, "${uploadPath}", data.brandBigImageUrl);
                    initImageForUpdate(2,"sys_shop","image_brand", 1,200,100, "${uploadPath}", data.brandImageUrl);
                    reValidateForm();
                    removeValidateField('imageInfo_1');
                    removeValidateField('imageInfo_2');
                }
            });
        } else {
            $("#btn_edit").attr("data-target", "");/**没有选中记录不可打开模态框**/
            showMsg("请选择一行记录！");
        }
    }
    </shiro:hasPermission>

</script>

<!--添加编辑模态框（Modal） -->
<div class="modal fade" id="addOrEditModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
    <div class="modal-dialog" style="width:70%">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h5 class="modal-title" id="myModalLabel"></h5>
            </div>
            <div class="modal-body">
                <form id="form1" method="post" action="${basePath}/back/brand/saveOrUpdateBrand.sjson">
                    <input id="brandId" type="hidden" name="brandId" noclear="true"/>
                    <table align="center" class="addOrEditTable table-bordered table" style="width:100%;">
                        <tr>
                            <td class="toright_td"><span style="color:red">* </span>首页推荐品牌图片</td>
                            <td class="toleft_td" colspan="3">
                                <div class="container">
                                    <input id="imageUrl_1" type="hidden" name="brandBigImageUrl" value=""/>
                                    <div class="form-group" id="fileWrap1"></div>
                                </div>
                            <span style="color:red">提示：请上传规格宽191px，高77px的图片</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="toright_td"><span style="color:red">* </span>品牌列表大图</td>
                            <td class="toleft_td" colspan="3">
                                <div class="container">
                                    <input id="imageUrl_2" type="hidden" name="brandImageUrl" value="">
                                    <div class="form-group" id="fileWrap2"></div>
                                </div>
                                <span style="color:red">提示：请上传规格宽200px，高100px的图片</span>
                            </td>
                        </tr>
                        <tr>
                            <td class="toright_td" width="150px"><span style="color:red">* </span>品牌名称:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <div class="form-group">
                                    <input type="text" class="form-control input-sm" id="brandName" name="brandName" placeholder="请输入品牌名称"/>
                                </div>
                            </td>
                            <td class="toright_td" width="150px"><span style="color:red">* </span>标题:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <div class="form-group">
                                    <input type="text" class="form-control input-sm" id="title" name="title" placeholder="请输入标题"/>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="toright_td" width="150px">品牌归类:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <div class="form-group">
                                    <select class="form-control input-sm" id="firstWord" name="firstWord">
                                        <option value="A">A</option>
                                        <option value="B">B</option>
                                        <option value="C">C</option>
                                        <option value="D">D</option>
                                        <option value="E">E</option>
                                        <option value="F">F</option>
                                        <option value="G">G</option>
                                        <option value="H">H</option>
                                        <option value="I">I</option>
                                        <option value="J">J</option>
                                        <option value="K">K</option>
                                        <option value="L">L</option>
                                        <option value="M">M</option>
                                        <option value="N">N</option>
                                        <option value="O">O</option>
                                        <option value="P">P</option>
                                        <option value="Q">Q</option>
                                        <option value="R">R</option>
                                        <option value="S">S</option>
                                        <option value="T">T</option>
                                        <option value="U">U</option>
                                        <option value="V">V</option>
                                        <option value="W">W</option>
                                        <option value="X">X</option>
                                        <option value="Y">Y</option>
                                        <option value="Z">Z</option>
                                        <option value="0">0</option>
                                        <option value="1">1</option>
                                        <option value="2">2</option>
                                        <option value="3">3</option>
                                        <option value="4">4</option>
                                        <option value="5">5</option>
                                        <option value="6">6</option>
                                        <option value="7">7</option>
                                        <option value="8">8</option>
                                        <option value="9">9</option>
                                    </select>
                                </div>
                            </td>
                            <td class="toright_td" width="150px"><span style="color:red">*</span>简介:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <div class="form-group">
                                    <input type="text" class="form-control input-sm " id="synopsis" name="synopsis" placeholder="请输入简介"/>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td class="toright_td" width="150px"><span style="color:red">*</span>排序号:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <div class="form-group">
                                    <input type="text" class="form-control input-sm " id="sortCode" name="sortCode" placeholder="请输入排序号"/>
                                </div>
                            </td>
                            <td class="toright_td" width="150px">店铺品牌广告:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <label class="checkbox-inline">
                                    <input type="radio" name="isHomePage" id="isHomePage_1" class="radioInput" value="1" checked>&nbsp;已推荐
                                </label>
                                <label class="checkbox-inline">
                                    <input type="radio" name="isHomePage" id="isHomePage_0" class="radioInput" value="0">&nbsp;未推荐
                                </label>
                            </td>
                        </tr>
                        <tr>
                            <td class="toright_td" width="150px">是否显示:&nbsp;&nbsp;</td>
                            <td class="toleft_td" >
                                <label class="checkbox-inline">
                                    <input type="radio" name="isShow" id="isShow_1" class="radioInput" value="1" checked>&nbsp;已显示
                                </label>
                                <label class="checkbox-inline">
                                    <input type="radio" name="isShow" id="isShow_0" class="radioInput" value="0">&nbsp;未显示
                                </label>
                            </td>
                            <td class="toright_td" width="150px">品牌墙推荐:&nbsp;&nbsp;</td>
                            <td class="toleft_td">
                                <label class="checkbox-inline">
                                    <input type="radio" name="isRecommend" id="isRecommend_1" class="radioInput" value="1" checked>&nbsp;已推荐
                                </label>
                                <label class="checkbox-inline">
                                    <input type="radio" name="isRecommend" id="isRecommend_0" class="radioInput" value="0">&nbsp;未推荐
                                </label>
                            </td>
                        </tr>
                    </table>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" id="validateBtn" class="btn btn-primary" onclick="submitForm()">保存</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>